<template>
	<view class="content">
		<view class="imgBack">
			<image src="../../static/login/loginBackground.png"></image>
		</view>
		<view class="box">
			<image class="logo" src="../../static/login/loginLogo.png"></image>
			<view class="accountMessage">
				<uni-easyinput class="input1" type="text" :inputBorder="false" v-model="form.phoneNumber" placeholder="请输入手机号"></uni-easyinput>
				<view style="height: 40rpx" />
				<uni-easyinput class="input2" type="password" :inputBorder="false" v-model="form.passWord" placeholder="请输入密码"></uni-easyinput>
			</view>
			<view>
				<button class="login" @click="login">登录</button>
			</view>
		</view>
	</view>
</template>

<script setup>
import { ref } from 'vue';
const form = ref({
	phoneNumber: '',
	passWord: ''
});

const login = () => {
	    wx.navigateTo({
	      url: "/pages/student/index",
	    });
};
</script>

<style scoped lang="scss">
.content {
	width: 750rpx;
	height: 100vh;
	.imgBack {
		position: absolute;
		z-index: 1;
		> image {
			width: 613rpx;
			height: 615rpx;
		}
	}
	.box {
		position: absolute;
		z-index: 2;
		.logo {
			margin-left: 209rpx;
			margin-top: 251rpx;
			width: 332rpx;
			height: 134rpx;
		}
		.accountMessage {
			margin: 172rpx 65rpx 72rpx 65rpx;
			.input :first-child {
				margin-bottom: 40rpx;
			}
			::v-deep .uni-easyinput__content {
				border-radius: 48rpx;
				width: 620rpx;
				height: 96rpx;
				padding-left: 50rpx;
				padding-right: 40rpx;
				.uni-easyinput__content-input{
					padding-left:30px !important;
				}
			}
			::v-deep .uni-easyinput__placeholder-class {
				font-family: Alibaba PuHuiTi 2;
				font-weight: normal;
				font-size: 30rpx;
				color: #a0a0a2;
				line-height: 16rpx;
			}
			::v-deep uni-easyinput__content is-input-border {
				background: #a0a0a2;
			}
		}
		::v-deep .uni-easyinput:first-child {
			.uni-easyinput__content {
				.uni-easyinput__content-input::before {
					content: '';
					width: 42rpx;
					height: 42rpx;
					background: url('../../static/login/phoneNumber.png') center center / 100% 100% no-repeat;
					position: absolute;
					display: block;
					left: 0rpx;
					top:12rpx
				}
			}
		}
		::v-deep .uni-easyinput:last-child {
			.uni-easyinput__content {
				.uni-easyinput__content-input::before {
					content: '';
					width: 42rpx;
					height: 42rpx;
					background: url('../../static/login/passWord.png') center center / 100% 100% no-repeat;
					position: absolute;
					display: block;
					left: 0rpx;
					top:12rpx
				}
			}
		}
		.login {
			background: #10ba76;
			border-radius: 48rpx;
			font-family: AlibabaPuHuiTi;
			font-weight: 400;
			width: 620rpx;
			height: 96rpx;
			font-size: 28rpx;
			color: #ffffff;
			line-height: 96rpx;
		}
	}
}
</style>
